<div class="draggable-demo">

  <section>
    <h2>Droppable</h2>
    <div class="row">
      <div class="col-sm-5" style="min-height: 80px;background: #F5F5F5; padding-top: 20px">
        <ul class="list-group">
          <li class="list-group-item" *ngFor="let item of source" reDraggable="groupName" [dragData]="item">
            {{item}}
          </li>
        </ul>
      </div>
      <div class="col-sm-offset-2 col-sm-5" style="min-height: 80px; background: #F5F5F5;padding-top: 20px"
           reDroppable="groupName"
           (onDrop)="onDrop2Right($event)">
        <ul class="list-group">
          <li class="list-group-item" *ngFor="let item of target">{{item}}
          </li>
        </ul>
      </div>
    </div>
  </section>
</div>
